<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<style>
  .retList a{
    color:#FFFFFF;
  }
  .retList a:hover{
    color:#FFFFFF;
  }
  .retList{
    border-radius: 5px;
    background: #0b93d5;
    color:#FFFFFF;
    width:300px;
    padding: 10px 2px 10px 2px;
  }
  .retList li{
    line-height: 25px;
    border-bottom: 2px dotted white;
    margin: 0px 5px 0px 5px;
    text-align: left;
  }
</style>
<body class="hold-transition skin-yellow sidebar-mini">
<!--添加或编辑-->
<div class="modal fade" data-backdrop="static" data-keyboard="false" id="modal-addOrEdit">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">编辑</h4>
      </div>
      <div class="modal-body">
        <form id="addOrEditForm" class="form-horizontal" role="form">
          <div class="form-group">
            <label for="badaNam" class="col-sm-2 control-label no-padding-right">反馈名称</label>
            <div class="col-sm-10">
              <input id="badaNam" name="badaNam" type="text" maxlength="255" style="width: 200px;"
                     class="form-control" placeholder="请输入反馈名称"/>
              <input name="badaPid" style="display: none" type="hidden" />
              <input name="badaId" style="display: none" type="hidden" />
            </div>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-info" id="btn_confirm">保存</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
      </div>
    </div>
  </div>
</div>
<section class="content-header">
  <h1>总调计划反馈信息配置</h1>
</section>
<section class="content">
  <div class="row">
    <div class="col-xs-12">
      <div class="box">
        <div class="box-body">
          <table id="bootstrap-table"></table>
        </div>
      </div>
    </div>
  </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
  let table, tempTable, tempData = new Array(), currentProject;
  $(function () {
    /**
     * 加载列表
     */
    loadTable();
    /**
     * 模态框隐藏事件， 重置表单，重置验证
     */
    js.modal.hideEvent("modal-add", function () {
      js.validate.reset("addOrEditForm");
      js.reset("addOrEditForm");
    });
    /**
     * 添加类别
     */
    $("#btn_add").on('click', function () {
      js.modal.open("modal-add");
    });
    /**
     * 验证
     */
    js.validate.init("addOrEditForm", {
      fields: {
        badaNam: {validators: {notEmpty: {message: '尊敬的用户，请输入反馈名称！'}}}
      }
    });
    /**
     * 保存
     */
    $("#btn_confirm").on('click', function () {
      js.validSubmit({
        formId: "addOrEditForm",
        url: ctx + "task/base/addOrEditRet",
        data: new FormData($("#addOrEditForm")[0]),
        success: function (result) {
          if (result.type === web_status.SUCCESS) {
            js.modal.success(result.msg);
            js.modal.hide("modal-addOrEdit");
          } else {
            js.modal.warning(result.msg);
          }
          js.table.refresh(table);
        }
      });
    });
  });
  /**
   * 添加反馈信息
   */
  function add(badaId){
    $("#addOrEditForm [name='badaPid']").val(badaId);
    js.modal.open('modal-addOrEdit');
  }

  /**
   * 删除
   */
  function removeRet(badaId){
    js.confirmPost({
      content: "尊敬的用户，您确认要删除此反馈信息吗？",
      url: ctx + "task/base/removeRet",
      data: {
        badaId:badaId
      },
      success: function (result) {
        if (result.type === web_status.SUCCESS) {
          js.modal.success(result.msg);
        } else {
          js.modal.warning(result.msg);
        }
        js.table.refresh(table);
      }
    });
  }


  /**
   * 加载列表
   */
  function loadTable() {
    table = js.table.init({
      url: ctx + "task/base/planList",
      showColumns: true,
      showExport: true,
      columns: [
        {
          title: '序号', width: '60',
          formatter: function (value, row, index, field) {
            var pageSize = table.bootstrapTable('getOptions').pageSize;
            var pageNumber = table.bootstrapTable('getOptions').pageNumber;
            return pageSize * (pageNumber - 1) + index + 1;
          }
        },
        {
          title: '计划名称', field: 'badaNam',
          formatter: function (value, row, index) {
            if (value != null) {
              return value;
            } else {
              return '--';
            }

          }
        },
        {
          title: '计划类别', field: 'badaTyp2',
          formatter: function (value, row, index) {
            if (value != null) {
              return value;
            } else {
              return '--';
            }

          }
        },
        {
          title: '反馈信息', field: 'childHtml',width:'320px',
          formatter: function (value, row, index) {
            if (value != null) {
              return value;
            } else {
              return '--';
            }

          }
        },
        {
          title: '操作', width: '180',
          formatter: function (value, row, index) {
            let elements = new Array();
            elements.push('<button class="btn btn-success btn-xs" onclick="add(' + row.badaId + ')">添加反馈信息</button>');
            return elements.join('');
          }
        }
      ]
    });
  }
  //获取反馈信息数据并打开编辑面板
  function showEdit(badaId){
    js.post({
      url: ctx + "task/base/getRetInf",
      data: {badaId: badaId},
      success: function (result) {
        if (result.type === web_status.SUCCESS) {
          $("#addOrEditForm").fillData(result.data);
          js.modal.open('modal-addOrEdit');
        }
      }
    })

  }
</script>
</body>
</html>